<!DOCTYPE html>
<html>
<head>
<style> 
#borderimg { 
  border: 10px solid transparent;
  padding: 15px;
  border-image: url(../static/img/border.png) 30 round;
}
</style>
</head>
<body>

<h1>border-image 属性</h1>

<p>在这里，重复图像的中间部分，来创建边框：</p>
<p id="borderimg">border-image: url(../static/img/border.png) 30 round;</p>

<p>这是原始图像：</p><img src="./static/img/border.png">
<p>这是原始图像：</p><img src="static/img/border.png">
<p>这是原始图像：</p><img src="../static/img/border.png">
<p><b>注释：</b>Internet Explorer 10 以及更早的版本不支持 border-image 属性。</p>

</body>
</html>
